<template>
	<view class="container">
		<view class="address-item-container">
			<view v-if="addresslist.length>0">
				<view class="address_item" v-for="(item,index) in addresslist" :key="index">
					<view class="address_item_left">
						<view class="address_item_top">
							<text class="address_item_top_text1">{{item.consignee}}</text>
							<text class="address_item_top_text2">{{item.mobile}}</text>
							<text class="address_item_top_text3" v-if="item.is_default">默认</text>
							<button v-if="is_cart!=0" size="mini" @tap="chooseAddress(item.address_id)"
								class="chooseBtn">选择地址</button>
						</view>
						<view class="address_item_bottom">
							<text>{{item.province+item.city+item.district+item.address}}</text>
						</view>
					</view>
					<view class="address_item_right">
						<button size="mini" class="edit-btn"
							@tap='jump(`/pages/center/add-edit-address`,item.address_id)'>编辑</button>
						<image v-if="false" src="https://farm-city.oss-cn-hangzhou.aliyuncs.com/static/images/bianji.png" mode="widthFix"
							@tap='jump(`/pages/center/add-edit-address`,item.address_id)'></image>
					</view>
				</view>
			</view>
			<view class="empty-container" v-else>
				<u-empty text="暂无收货地址" :icon="emptyIcon" />
			</view>
		</view>
		<!-- #ifndef APP-PLUS -->
		<view class="address_fixed">
			<button type="default" class="address_btn" @tap='jump1(`/pages/center/add-edit-address`)'>新建收货地址</button>
		</view>
		<!-- #endif -->
	</view>
</template>

<script>
	var _this
	export default {
		data() {
			return {
				emptyIcon: 'https://farm-city.oss-cn-hangzhou.aliyuncs.com/static/common/empty.png',
				addresslist: [],
				is_cart: 0
			}
		},
		onLoad(option) {
			_this = this
			if (option.is_cart != undefined) {
				this.is_cart = option.is_cart
			}
		},
		onShow() {
			this.getAddreeeList()
		},
		onNavigationBarButtonTap(e) {
			uni.navigateTo({
				url: `/pages/center/add-edit-address?is_cart=${_this.is_cart}`
			})
		},
		methods: {
			//获取地址列表
			async getAddreeeList() {
				const data = await _this.$post('api/AddressList')
				this.addresslist = data.data.address
			},
			chooseAddress(address_id) {
				uni.$emit('chooseAddress', address_id)
				uni.navigateBack({})
			},
			//路由跳转
			jump(url, id) {
				this.$u.route({
					url,
					params: {
						id,
						is_cart: this.is_cart
					}
				})
			},
			//路由跳转
			jump1(url) {
				this.$u.route({
					url,
					params: {
						is_cart: this.is_cart
					}
				})
			},
			//隐藏手机号
			phoneNumShow() {
				let that = this;
				let number = this.vuex_user.mobile; //获取到手机号码字段
				// console.log('手机号', number)
				let mphone = number.substring(0, 3) + '****' + number.substring(7);
				that.phone = mphone
				// console.log(phone);
			},

		}
	}
</script>

<style lang="scss" scoped>
	.container {
		.address-item-container {
			.address_item {
				border-radius: 20rpx;
				margin-bottom: 20rpx;
				padding: 25rpx 30rpx;
				@include flex-center();
				background: #fff;

				.address_item_left {
					flex: 1;

					.address_item_top {
						display: flex;
						align-items: center;
						font-size: 32rpx;

						.address_item_top_text1 {
							font-weight: 500;
						}

						.address_item_top_text2 {
							margin-left: 10rpx;
							font-weight: 500;
						}

						.address_item_top_text3 {
							margin-left: 10rpx;
							background: rgba($color-A9FBB3, 0.2);
							color: $theme-color;
							border-radius: 15rpx;
							font-size: 24rpx;
							padding: 2rpx 16rpx;
						}

						.chooseBtn {
							padding: 0 15rpx;
							height: 50rpx;
							line-height: 50rpx;
							color: #fff;
							margin: 0 0 0 10rpx;
							background: $theme-color;
						}
					}

					.address_item_bottom {
						margin-top: 10rpx;
						font-size: 28rpx;
					}
				}

				.address_item_right {
					.edit-btn {
						color: $color-919191;
						border: 2rpx solid $color-919191;
						width: 80rpx;
						height: 47rpx;
						line-height: 45rpx;
						background: none;
						padding: 0;
						border-radius: 8rpx;
					}

					image {
						width: 27rpx;
						height: 27rpx;
					}
				}
			}
		}
	}

	.address_fixed {
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 110rpx;
	}

	.address_btn {
		margin: 0 20rpx;
		height: 80rpx;
		border-radius: 44rpx;
		background: $theme-color;
		color: #fff;
		font-size: 28rpx;
		line-height: 80rpx;
		font-weight: 300;
	}
</style>